@import "./common.less";
body {
  background-color: #f5f5f5;
  .header {
    background-color: #cf4ccf;
    .relative();
    .width(420);
    .height(50);
    .back {
      .width(20);
      .height(30);
      .absolute(10,15);
      img {
        .width(20);
        .height(30);
      }
    }
    .welcome {
      color: #ffffff;
      text-align: center;
      .padding-Top(15);
      .fz(23);
    }
    .message {
      .absolute(10,380);
      img {
        .width(25);
        .height(30);
      }
    }
  }
  form {
    .width(340);
    .center(50);
    .padding(30,10,30,10);
    h2 {
      .fz(23);
      margin-bottom: (10 / @m);
      color: #cf4ccf;
    }
    input {
      .width(300);
      .padding(10,10,10,10);
      border: (1px / @m) solid #ddd;
      margin-bottom: (15 / @m);
      .border-r(10);
      .fz(23);
      color: #7b257b;
      // 设置placeholder颜色
      &::placeholder {
        color: #7b257b;
        .fz(20);
      }
    }
    .code {
      .relative();
      input {
        .width(150);
      }
      .container {
        .absolute(2,200);
        #cs {
          background-color: #7d1e7d;
          .width(100);
          .height(50);
          border: (1px / @m) solid #ddd;
          .border-r(10);
        }
      }
    }
    p {
      margin-top: (15 / @m);
      button {
        .width(320);
        .height(50);
        color: #ffffff;
        .padding(10,10,10,10);
        border: (1px / @m) solid #ddd;
        .border-r(10);
        background-color: #cf4ccf;
        cursor: pointer;
        margin-bottom: (20 / @m);
      }
    }
    .hide {
      display: none;
    }
    label {
      .padding(10,10,10,10);
      input {
        .width(20);
        .height(20);
      }
      span {
        padding-left: (10 / @m);
        .fz(20);
        color: #7b257b;
      }
    }
  }
}
